<!DOCTYPE html>
<html lang="zh-cn" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>UI DEMO</title>
    <meta name="description" content="组件库和插件库">
    <meta name="generator" content="VitePress v1.0.0-rc.44">
    <link rel="preload stylesheet" href="/abs-ui-doc/assets/style.BgpjbcMt.css" as="style">
    
    <script type="module" src="/abs-ui-doc/assets/app.NcbvBTUB.js"></script>
    <link rel="preload" href="/abs-ui-doc/assets/inter-roman-latin.Bu8hRsVA.woff2" as="font" type="font/woff2" crossorigin="">
    <link rel="modulepreload" href="/abs-ui-doc/assets/chunks/framework.BL0IJ4-B.js">
    <link rel="modulepreload" href="/abs-ui-doc/assets/chunks/theme.BthvYAMb.js">
    <link rel="modulepreload" href="/abs-ui-doc/assets/demos_Base_ElsMarkdown_test.md.Bzu3x6bV.lean.js">
    <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
    <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
  </head>
  <body>
    <div id="app"><div class="Layout" data-v-91f95fec><!--[--><!--]--><!--[--><span tabindex="-1" data-v-5b19f3e1></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-5b19f3e1> Skip to content </a><!--]--><!----><header class="VPNav" data-v-91f95fec data-v-fc7b0ed4><div class="VPNavBar" data-v-fc7b0ed4 data-v-37299660><div class="wrapper" data-v-37299660><div class="container" data-v-37299660><div class="title" data-v-37299660><div class="VPNavBarTitle" data-v-37299660 data-v-11edf0f4><a class="title" href="/abs-ui-doc/" data-v-11edf0f4><!--[--><!--]--><!--[--><img class="VPImage logo" src="/abs-ui-doc/vue.svg" alt data-v-e5319822><!--]--><span data-v-11edf0f4>组件库标题</span><!--[--><!--]--></a></div></div><div class="content" data-v-37299660><div class="content-body" data-v-37299660><!--[--><!--]--><div class="VPNavBarSearch search" data-v-37299660><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><span class="vp-icon DocSearch-Search-Icon"></span><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-37299660 data-v-43228b6f><span id="main-nav-aria-label" class="visually-hidden" data-v-43228b6f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/abs-ui-doc/guide/" tabindex="0" data-v-43228b6f data-v-c84d6c41><!--[--><span data-v-c84d6c41>指南</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/abs-ui-doc/libs/" tabindex="0" data-v-43228b6f data-v-c84d6c41><!--[--><span data-v-c84d6c41>组件库</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/abs-ui-doc/plugins/" tabindex="0" data-v-43228b6f data-v-c84d6c41><!--[--><span data-v-c84d6c41>插件库</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-37299660 data-v-47c1fea6><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="Switch to dark theme" aria-checked="false" data-v-47c1fea6 data-v-26b401be data-v-fd1c020d><span class="check" data-v-fd1c020d><span class="icon" data-v-fd1c020d><!--[--><span class="vpi-sun sun" data-v-26b401be></span><span class="vpi-moon moon" data-v-26b401be></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-37299660 data-v-af15f861 data-v-5cd70e58><!--[--><a class="VPSocialLink no-icon" href="https://github.com/vuejs/vitepress" aria-label="github" target="_blank" rel="noopener" data-v-5cd70e58 data-v-87dcca7e><span class="vpi-social-github" /></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-37299660 data-v-7bb50b53 data-v-f9b1ba34><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-f9b1ba34><span class="vpi-more-horizontal icon" data-v-f9b1ba34></span></button><div class="menu" data-v-f9b1ba34><div class="VPMenu" data-v-f9b1ba34 data-v-33033a17><!----><!--[--><!--[--><!----><div class="group" data-v-7bb50b53><div class="item appearance" data-v-7bb50b53><p class="label" data-v-7bb50b53>Appearance</p><div class="appearance-action" data-v-7bb50b53><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="Switch to dark theme" aria-checked="false" data-v-7bb50b53 data-v-26b401be data-v-fd1c020d><span class="check" data-v-fd1c020d><span class="icon" data-v-fd1c020d><!--[--><span class="vpi-sun sun" data-v-26b401be></span><span class="vpi-moon moon" data-v-26b401be></span><!--]--></span></span></button></div></div></div><div class="group" data-v-7bb50b53><div class="item social-links" data-v-7bb50b53><div class="VPSocialLinks social-links-list" data-v-7bb50b53 data-v-5cd70e58><!--[--><a class="VPSocialLink no-icon" href="https://github.com/vuejs/vitepress" aria-label="github" target="_blank" rel="noopener" data-v-5cd70e58 data-v-87dcca7e><span class="vpi-social-github" /></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-37299660 data-v-827ba88d><span class="container" data-v-827ba88d><span class="top" data-v-827ba88d></span><span class="middle" data-v-827ba88d></span><span class="bottom" data-v-827ba88d></span></span></button></div></div></div></div><div class="divider" data-v-37299660><div class="divider-line" data-v-37299660></div></div></div><!----></header><div class="VPLocalNav empty fixed" data-v-91f95fec data-v-72a02c01><div class="container" data-v-72a02c01><!----><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-72a02c01 data-v-4f7ce968><button data-v-4f7ce968>Return to top</button><!----></div></div></div><!----><div class="VPContent" id="VPContent" data-v-91f95fec data-v-02b9f521><div class="VPDoc has-aside" data-v-02b9f521 data-v-5323408c><!--[--><!--]--><div class="container" data-v-5323408c><div class="aside" data-v-5323408c><div class="aside-curtain" data-v-5323408c></div><div class="aside-container" data-v-5323408c><div class="aside-content" data-v-5323408c><div class="VPDocAside" data-v-5323408c data-v-68285018><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-68285018 data-v-ee00fa7c><div class="content" data-v-ee00fa7c><div class="outline-marker" data-v-ee00fa7c></div><div class="outline-title" role="heading" aria-level="2" data-v-ee00fa7c>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-ee00fa7c><span class="visually-hidden" id="doc-outline-aria-label" data-v-ee00fa7c> Table of Contents for current page </span><ul class="VPDocOutlineItem root" data-v-ee00fa7c data-v-9c2859a9><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-68285018></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-5323408c><div class="content-container" data-v-5323408c><!--[--><!--]--><main class="main" data-v-5323408c><div style="position:relative;" class="vp-doc _abs-ui-doc_demos_Base_ElsMarkdown_test" data-v-5323408c><div><h2 id="教程" tabindex="-1">教程 <a class="header-anchor" href="#教程" aria-label="Permalink to &quot;教程&quot;">​</a></h2><p>这是一篇讲解如何正确使用 <strong>Markdown</strong> 的排版示例，学会这个很有必要，能让你的文章有更佳清晰的排版。</p><blockquote><p>引用文本：Markdown is a text formatting syntax inspired</p></blockquote><h2 id="语法指导" tabindex="-1">语法指导 <a class="header-anchor" href="#语法指导" aria-label="Permalink to &quot;语法指导&quot;">​</a></h2><h3 id="普通内容" tabindex="-1">普通内容 <a class="header-anchor" href="#普通内容" aria-label="Permalink to &quot;普通内容&quot;">​</a></h3><p>这段内容展示了在内容里面一些排版格式，比如：</p><ul><li><strong>加粗</strong> - <code>**加粗**</code></li><li><em>倾斜</em> - <code>*倾斜*</code></li><li><s>删除线</s> - <code>~~删除线~~</code></li><li><code>Code 标记</code> - <code>`Code 标记`</code></li><li><a href="https://ld246.com" target="_blank" rel="noreferrer">超级链接</a> - <code>[超级链接](https://ld246.com)</code></li><li><a href="mailto:username@gmail.com" target="_blank" rel="noreferrer">username@gmail.com</a> - <code>[username@gmail.com](mailto:username@gmail.com)</code></li></ul><h3 id="提及用户" tabindex="-1">提及用户 <a class="header-anchor" href="#提及用户" aria-label="Permalink to &quot;提及用户&quot;">​</a></h3><p>@Vanessa 通过 <code>@User</code> 可以在内容中提及用户，被提及的用户将会收到系统通知。</p><blockquote><p>NOTE:</p><ol><li>@用户名之后需要有一个空格</li><li>新手没有艾特的功能权限</li></ol></blockquote><h3 id="表情符号-emoji" tabindex="-1">表情符号 Emoji <a class="header-anchor" href="#表情符号-emoji" aria-label="Permalink to &quot;表情符号 Emoji&quot;">​</a></h3><p>支持大部分标准的表情符号，可使用输入法直接输入，也可手动输入字符格式。通过输入 <code>:</code> 触发自动完成，可在个人设置中<a href="https://ld246.com/settings/function" target="_blank" rel="noreferrer">设置常用表情</a>。</p><h4 id="一些表情例子" tabindex="-1">一些表情例子 <a class="header-anchor" href="#一些表情例子" aria-label="Permalink to &quot;一些表情例子&quot;">​</a></h4><p>😄 😆 😵 😭 😰 😅 😢 😤 😍 😌 👍 👎 💯 👏 🔔 🎁 ❓ 💣 ❤️ ☕ 🌀 🙇 💋 🙏 💢</p><h3 id="大标题-heading-3" tabindex="-1">大标题 - Heading 3 <a class="header-anchor" href="#大标题-heading-3" aria-label="Permalink to &quot;大标题 - Heading 3&quot;">​</a></h3><p>你可以选择使用 H1 至 H6，使用 ##(N) 打头。建议帖子或回帖中的顶级标题使用 Heading 3，不要使用 1 或 2，因为 1 是系统站点级，2 是帖子标题级。</p><blockquote><p>NOTE: 别忘了 # 后面需要有空格！</p></blockquote><h4 id="heading-4" tabindex="-1">Heading 4 <a class="header-anchor" href="#heading-4" aria-label="Permalink to &quot;Heading 4&quot;">​</a></h4><h5 id="heading-5" tabindex="-1">Heading 5 <a class="header-anchor" href="#heading-5" aria-label="Permalink to &quot;Heading 5&quot;">​</a></h5><h6 id="heading-6" tabindex="-1">Heading 6 <a class="header-anchor" href="#heading-6" aria-label="Permalink to &quot;Heading 6&quot;">​</a></h6><h3 id="图片" tabindex="-1">图片 <a class="header-anchor" href="#图片" aria-label="Permalink to &quot;图片&quot;">​</a></h3><div class="language- vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span>![alt 文本](http://image-path.png)</span></span>
<span class="line"><span>![alt 文本](http://image-path.png &quot;图片 Title 值&quot;)</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br></div></div><p>支持复制粘贴直接上传。</p><h3 id="代码块" tabindex="-1">代码块 <a class="header-anchor" href="#代码块" aria-label="Permalink to &quot;代码块&quot;">​</a></h3><h4 id="普通" tabindex="-1">普通 <a class="header-anchor" href="#普通" aria-label="Permalink to &quot;普通&quot;">​</a></h4><div class="language- vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span>*emphasize*    **strong**</span></span>
<span class="line"><span>_emphasize_    __strong__</span></span>
<span class="line"><span>var a = 1</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br></div></div><h4 id="语法高亮支持" tabindex="-1">语法高亮支持 <a class="header-anchor" href="#语法高亮支持" aria-label="Permalink to &quot;语法高亮支持&quot;">​</a></h4><p>如果在 ``` 后面跟随语言名称，可以有语法高亮的效果哦，比如:</p><h5 id="演示-go-代码高亮" tabindex="-1">演示 Go 代码高亮 <a class="header-anchor" href="#演示-go-代码高亮" aria-label="Permalink to &quot;演示 Go 代码高亮&quot;">​</a></h5><div class="language-go vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">go</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">package</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> main</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">fmt</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">func</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> main</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">() {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	fmt.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">Println</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;Hello, 世界&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br></div></div><h5 id="演示-java-高亮" tabindex="-1">演示 Java 高亮 <a class="header-anchor" href="#演示-java-高亮" aria-label="Permalink to &quot;演示 Java 高亮&quot;">​</a></h5><div class="language-java vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">java</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">public</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> class</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> HelloWorld</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">    public</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> static</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> void</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> main</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">String</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">[] </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">args</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        System.out.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">println</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;Hello World!&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br></div></div><blockquote><p>Tip: 语言名称支持下面这些: <code>ruby</code>, <code>python</code>, <code>js</code>, <code>html</code>, <code>erb</code>, <code>css</code>, <code>coffee</code>, <code>bash</code>, <code>json</code>, <code>yml</code>, <code>xml</code> ...</p></blockquote><h3 id="有序、无序、任务列表" tabindex="-1">有序、无序、任务列表 <a class="header-anchor" href="#有序、无序、任务列表" aria-label="Permalink to &quot;有序、无序、任务列表&quot;">​</a></h3><h4 id="无序列表" tabindex="-1">无序列表 <a class="header-anchor" href="#无序列表" aria-label="Permalink to &quot;无序列表&quot;">​</a></h4><ul><li>Java <ul><li>Spring <ul><li>IoC</li><li>AOP</li></ul></li></ul></li><li>Go <ul><li>gofmt</li><li>Wide</li></ul></li><li>Node.js <ul><li>Koa</li><li>Express</li></ul></li></ul><h4 id="有序列表" tabindex="-1">有序列表 <a class="header-anchor" href="#有序列表" aria-label="Permalink to &quot;有序列表&quot;">​</a></h4><ol><li>Node.js <ol><li>Express</li><li>Koa</li><li>Sails</li></ol></li><li>Go <ol><li>gofmt</li><li>Wide</li></ol></li><li>Java <ol><li>Latke</li><li>IDEA</li></ol></li></ol><h4 id="任务列表" tabindex="-1">任务列表 <a class="header-anchor" href="#任务列表" aria-label="Permalink to &quot;任务列表&quot;">​</a></h4><ul><li>[x] 发布 Sym</li><li>[x] 发布 Solo</li><li>[ ] 预约牙医</li></ul><h3 id="表格" tabindex="-1">表格 <a class="header-anchor" href="#表格" aria-label="Permalink to &quot;表格&quot;">​</a></h3><p>如果需要展示数据什么的，可以选择使用表格。</p><table><thead><tr><th>header 1</th><th>header 2</th></tr></thead><tbody><tr><td>cell 1</td><td>cell 2</td></tr><tr><td>cell 3</td><td>cell 4</td></tr><tr><td>cell 5</td><td>cell 6</td></tr></tbody></table><h3 id="隐藏细节" tabindex="-1">隐藏细节 <a class="header-anchor" href="#隐藏细节" aria-label="Permalink to &quot;隐藏细节&quot;">​</a></h3><details><summary>这里是摘要部分。</summary> 这里是细节部分。 </details><h3 id="段落" tabindex="-1">段落 <a class="header-anchor" href="#段落" aria-label="Permalink to &quot;段落&quot;">​</a></h3><p>空行可以将内容进行分段，便于阅读。（这是第一段）</p><p>使用空行在 Markdown 排版中相当重要。（这是第二段）</p><h3 id="链接引用" tabindex="-1">链接引用 <a class="header-anchor" href="#链接引用" aria-label="Permalink to &quot;链接引用&quot;">​</a></h3><p><a href="https://b3log.org" target="_blank" rel="noreferrer">链接文本</a></p><div class="language- vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span>[链接文本][链接标识]</span></span>
<span class="line"><span></span></span>
<span class="line"><span>[链接标识]: https://b3log.org</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br></div></div><h3 id="数学公式" tabindex="-1">数学公式 <a class="header-anchor" href="#数学公式" aria-label="Permalink to &quot;数学公式&quot;">​</a></h3><p>多行公式块：</p><p>$$ \frac{1}{ \Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{ \frac25 \pi}} = 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} { 1+\frac{e^{-6\pi}} {1+\frac{e^{-8\pi}}{1+\cdots}} } } $$</p><p>行内公式：</p><p>公式 $a^2 + b^2 = \color{red}c^2$ 是行内。</p><h3 id="脑图" tabindex="-1">脑图 <a class="header-anchor" href="#脑图" aria-label="Permalink to &quot;脑图&quot;">​</a></h3><div class="language-mindmap vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">mindmap</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span>- 教程</span></span>
<span class="line"><span>- 语法指导</span></span>
<span class="line"><span>  - 普通内容</span></span>
<span class="line"><span>  - 提及用户</span></span>
<span class="line"><span>  - 表情符号 Emoji</span></span>
<span class="line"><span>    - 一些表情例子</span></span>
<span class="line"><span>  - 大标题 - Heading 3</span></span>
<span class="line"><span>    - Heading 4</span></span>
<span class="line"><span>      - Heading 5</span></span>
<span class="line"><span>        - Heading 6</span></span>
<span class="line"><span>  - 图片</span></span>
<span class="line"><span>  - 代码块</span></span>
<span class="line"><span>    - 普通</span></span>
<span class="line"><span>    - 语法高亮支持</span></span>
<span class="line"><span>      - 演示 Go 代码高亮</span></span>
<span class="line"><span>      - 演示 Java 高亮</span></span>
<span class="line"><span>  - 有序、无序、任务列表</span></span>
<span class="line"><span>    - 无序列表</span></span>
<span class="line"><span>    - 有序列表</span></span>
<span class="line"><span>    - 任务列表</span></span>
<span class="line"><span>  - 表格</span></span>
<span class="line"><span>  - 隐藏细节</span></span>
<span class="line"><span>  - 段落</span></span>
<span class="line"><span>  - 链接引用</span></span>
<span class="line"><span>  - 数学公式</span></span>
<span class="line"><span>  - 脑图</span></span>
<span class="line"><span>  - 流程图</span></span>
<span class="line"><span>  - 时序图</span></span>
<span class="line"><span>  - 甘特图</span></span>
<span class="line"><span>  - 图表</span></span>
<span class="line"><span>  - 五线谱</span></span>
<span class="line"><span>  - Graphviz</span></span>
<span class="line"><span>  - 多媒体</span></span>
<span class="line"><span>  - 脚注</span></span>
<span class="line"><span>- 快捷键</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br></div></div><h3 id="plantuml" tabindex="-1">plantuml <a class="header-anchor" href="#plantuml" aria-label="Permalink to &quot;plantuml&quot;">​</a></h3><div class="language-plantuml vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">plantuml</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span>@startuml component</span></span>
<span class="line"><span>actor client</span></span>
<span class="line"><span>node app</span></span>
<span class="line"><span>database db</span></span>
<span class="line"><span></span></span>
<span class="line"><span>db -&gt; app</span></span>
<span class="line"><span>app -&gt; client</span></span>
<span class="line"><span>@enduml</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br></div></div><p>更多图形参考<a href="https://plantuml.com/zh/" target="_blank" rel="noreferrer">https://plantuml.com/zh/</a></p><h3 id="流程图" tabindex="-1">流程图 <a class="header-anchor" href="#流程图" aria-label="Permalink to &quot;流程图&quot;">​</a></h3><div class="language-mermaid vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">mermaid</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">graph TB</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    c1--&gt;a2</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    subgraph one</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    a1--&gt;a2</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    end</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    subgraph two</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    b1--&gt;b2</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    end</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    subgraph three</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    c1--&gt;c2</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    end</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br></div></div><h3 id="时序图" tabindex="-1">时序图 <a class="header-anchor" href="#时序图" aria-label="Permalink to &quot;时序图&quot;">​</a></h3><div class="language-mermaid vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">mermaid</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">sequenceDiagram</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    Alice-&gt;&gt;John: Hello John, how are you?</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    loop Every minute</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        John--&gt;&gt;Alice: Great!</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    end</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><h3 id="甘特图" tabindex="-1">甘特图 <a class="header-anchor" href="#甘特图" aria-label="Permalink to &quot;甘特图&quot;">​</a></h3><div class="language-mermaid vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">mermaid</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">gantt</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    title A Gantt Diagram</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    dateFormat  YYYY-MM-DD</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    section Section</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    A task           :a1, 2019-01-01, 30d</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    Another task     :after a1  , 20d</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    section Another</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    Task in sec      :2019-01-12  , 12d</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    another task      : 24d</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br></div></div><h3 id="图表" tabindex="-1">图表 <a class="header-anchor" href="#图表" aria-label="Permalink to &quot;图表&quot;">​</a></h3><div class="language-echarts vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">echarts</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span>{</span></span>
<span class="line"><span>  &quot;title&quot;: { &quot;text&quot;: &quot;最近 30 天&quot; },</span></span>
<span class="line"><span>  &quot;tooltip&quot;: { &quot;trigger&quot;: &quot;axis&quot;, &quot;axisPointer&quot;: { &quot;lineStyle&quot;: { &quot;width&quot;: 0 } } },</span></span>
<span class="line"><span>  &quot;legend&quot;: { &quot;data&quot;: [&quot;帖子&quot;, &quot;用户&quot;, &quot;回帖&quot;] },</span></span>
<span class="line"><span>  &quot;xAxis&quot;: [{</span></span>
<span class="line"><span>      &quot;type&quot;: &quot;category&quot;,</span></span>
<span class="line"><span>      &quot;boundaryGap&quot;: false,</span></span>
<span class="line"><span>      &quot;data&quot;: [&quot;2019-05-08&quot;,&quot;2019-05-09&quot;,&quot;2019-05-10&quot;,&quot;2019-05-11&quot;,&quot;2019-05-12&quot;,&quot;2019-05-13&quot;,&quot;2019-05-14&quot;,&quot;2019-05-15&quot;,&quot;2019-05-16&quot;,&quot;2019-05-17&quot;,&quot;2019-05-18&quot;,&quot;2019-05-19&quot;,&quot;2019-05-20&quot;,&quot;2019-05-21&quot;,&quot;2019-05-22&quot;,&quot;2019-05-23&quot;,&quot;2019-05-24&quot;,&quot;2019-05-25&quot;,&quot;2019-05-26&quot;,&quot;2019-05-27&quot;,&quot;2019-05-28&quot;,&quot;2019-05-29&quot;,&quot;2019-05-30&quot;,&quot;2019-05-31&quot;,&quot;2019-06-01&quot;,&quot;2019-06-02&quot;,&quot;2019-06-03&quot;,&quot;2019-06-04&quot;,&quot;2019-06-05&quot;,&quot;2019-06-06&quot;,&quot;2019-06-07&quot;],</span></span>
<span class="line"><span>      &quot;axisTick&quot;: { &quot;show&quot;: false },</span></span>
<span class="line"><span>      &quot;axisLine&quot;: { &quot;show&quot;: false }</span></span>
<span class="line"><span>  }],</span></span>
<span class="line"><span>  &quot;yAxis&quot;: [{ &quot;type&quot;: &quot;value&quot;, &quot;axisTick&quot;: { &quot;show&quot;: false }, &quot;axisLine&quot;: { &quot;show&quot;: false }, &quot;splitLine&quot;: { &quot;lineStyle&quot;: { &quot;color&quot;: &quot;rgba(0, 0, 0, .38)&quot;, &quot;type&quot;: &quot;dashed&quot; } } }],</span></span>
<span class="line"><span>  &quot;series&quot;: [</span></span>
<span class="line"><span>    {</span></span>
<span class="line"><span>      &quot;name&quot;: &quot;帖子&quot;, &quot;type&quot;: &quot;line&quot;, &quot;smooth&quot;: true, &quot;itemStyle&quot;: { &quot;color&quot;: &quot;#d23f31&quot; }, &quot;areaStyle&quot;: { &quot;normal&quot;: {} }, &quot;z&quot;: 3,</span></span>
<span class="line"><span>      &quot;data&quot;: [&quot;18&quot;,&quot;14&quot;,&quot;22&quot;,&quot;9&quot;,&quot;7&quot;,&quot;18&quot;,&quot;10&quot;,&quot;12&quot;,&quot;13&quot;,&quot;16&quot;,&quot;6&quot;,&quot;9&quot;,&quot;15&quot;,&quot;15&quot;,&quot;12&quot;,&quot;15&quot;,&quot;8&quot;,&quot;14&quot;,&quot;9&quot;,&quot;10&quot;,&quot;29&quot;,&quot;22&quot;,&quot;14&quot;,&quot;22&quot;,&quot;9&quot;,&quot;10&quot;,&quot;15&quot;,&quot;9&quot;,&quot;9&quot;,&quot;15&quot;,&quot;0&quot;]</span></span>
<span class="line"><span>    },</span></span>
<span class="line"><span>    {</span></span>
<span class="line"><span>      &quot;name&quot;: &quot;用户&quot;, &quot;type&quot;: &quot;line&quot;, &quot;smooth&quot;: true, &quot;itemStyle&quot;: { &quot;color&quot;: &quot;#f1e05a&quot; }, &quot;areaStyle&quot;: { &quot;normal&quot;: {} }, &quot;z&quot;: 2,</span></span>
<span class="line"><span>      &quot;data&quot;: [&quot;31&quot;,&quot;33&quot;,&quot;30&quot;,&quot;23&quot;,&quot;16&quot;,&quot;29&quot;,&quot;23&quot;,&quot;37&quot;,&quot;41&quot;,&quot;29&quot;,&quot;16&quot;,&quot;13&quot;,&quot;39&quot;,&quot;23&quot;,&quot;38&quot;,&quot;136&quot;,&quot;89&quot;,&quot;35&quot;,&quot;22&quot;,&quot;50&quot;,&quot;57&quot;,&quot;47&quot;,&quot;36&quot;,&quot;59&quot;,&quot;14&quot;,&quot;23&quot;,&quot;46&quot;,&quot;44&quot;,&quot;51&quot;,&quot;43&quot;,&quot;0&quot;]</span></span>
<span class="line"><span>    },</span></span>
<span class="line"><span>    {</span></span>
<span class="line"><span>      &quot;name&quot;: &quot;回帖&quot;, &quot;type&quot;: &quot;line&quot;, &quot;smooth&quot;: true, &quot;itemStyle&quot;: { &quot;color&quot;: &quot;#4285f4&quot; }, &quot;areaStyle&quot;: { &quot;normal&quot;: {} }, &quot;z&quot;: 1,</span></span>
<span class="line"><span>      &quot;data&quot;: [&quot;35&quot;,&quot;42&quot;,&quot;73&quot;,&quot;15&quot;,&quot;43&quot;,&quot;58&quot;,&quot;55&quot;,&quot;35&quot;,&quot;46&quot;,&quot;87&quot;,&quot;36&quot;,&quot;15&quot;,&quot;44&quot;,&quot;76&quot;,&quot;130&quot;,&quot;73&quot;,&quot;50&quot;,&quot;20&quot;,&quot;21&quot;,&quot;54&quot;,&quot;48&quot;,&quot;73&quot;,&quot;60&quot;,&quot;89&quot;,&quot;26&quot;,&quot;27&quot;,&quot;70&quot;,&quot;63&quot;,&quot;55&quot;,&quot;37&quot;,&quot;0&quot;]</span></span>
<span class="line"><span>    }</span></span>
<span class="line"><span>  ]</span></span>
<span class="line"><span>}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br></div></div><h3 id="五线谱" tabindex="-1">五线谱 <a class="header-anchor" href="#五线谱" aria-label="Permalink to &quot;五线谱&quot;">​</a></h3><div class="language-abc vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">abc</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span>X: 24</span></span>
<span class="line"><span>T: Clouds Thicken</span></span>
<span class="line"><span>C: Paul Rosen</span></span>
<span class="line"><span>S: Copyright 2005, Paul Rosen</span></span>
<span class="line"><span>M: 6/8</span></span>
<span class="line"><span>L: 1/8</span></span>
<span class="line"><span>Q: 3/8=116</span></span>
<span class="line"><span>R: Creepy Jig</span></span>
<span class="line"><span>K: Em</span></span>
<span class="line"><span>|:&quot;Em&quot;EEE E2G|&quot;C7&quot;_B2A G2F|&quot;Em&quot;EEE E2G|\</span></span>
<span class="line"><span>&quot;C7&quot;_B2A &quot;B7&quot;=B3|&quot;Em&quot;EEE E2G|</span></span>
<span class="line"><span>&quot;C7&quot;_B2A G2F|&quot;Em&quot;GFE &quot;D (Bm7)&quot;F2D|\</span></span>
<span class="line"><span>1&quot;Em&quot;E3-E3:|2&quot;Em&quot;E3-E2B|:&quot;Em&quot;e2e gfe|</span></span>
<span class="line"><span>&quot;G&quot;g2ab3|&quot;Em&quot;gfeg2e|&quot;D&quot;fedB2A|&quot;Em&quot;e2e gfe|\</span></span>
<span class="line"><span>&quot;G&quot;g2ab3|&quot;Em&quot;gfe&quot;D&quot;f2d|&quot;Em&quot;e3-e3:|</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br></div></div><h3 id="graphviz" tabindex="-1">Graphviz <a class="header-anchor" href="#graphviz" aria-label="Permalink to &quot;Graphviz&quot;">​</a></h3><div class="language-graphviz vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">graphviz</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span>digraph finite_state_machine {</span></span>
<span class="line"><span>    rankdir=LR;</span></span>
<span class="line"><span>    size=&quot;8,5&quot;</span></span>
<span class="line"><span>    node [shape = doublecircle]; S;</span></span>
<span class="line"><span>    node [shape = point ]; qi</span></span>
<span class="line"><span></span></span>
<span class="line"><span>    node [shape = circle];</span></span>
<span class="line"><span>    qi -&gt; S;</span></span>
<span class="line"><span>    S  -&gt; q1 [ label = &quot;a&quot; ];</span></span>
<span class="line"><span>    S  -&gt; S  [ label = &quot;a&quot; ];</span></span>
<span class="line"><span>    q1 -&gt; S  [ label = &quot;a&quot; ];</span></span>
<span class="line"><span>    q1 -&gt; q2 [ label = &quot;ddb&quot; ];</span></span>
<span class="line"><span>    q2 -&gt; q1 [ label = &quot;b&quot; ];</span></span>
<span class="line"><span>    q2 -&gt; q2 [ label = &quot;b&quot; ];</span></span>
<span class="line"><span>}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br></div></div><h3 id="flowchart" tabindex="-1">Flowchart <a class="header-anchor" href="#flowchart" aria-label="Permalink to &quot;Flowchart&quot;">​</a></h3><div class="language-flowchart vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">flowchart</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span>st=&gt;start: Start</span></span>
<span class="line"><span>op=&gt;operation: Your Operation</span></span>
<span class="line"><span>cond=&gt;condition: Yes or No?</span></span>
<span class="line"><span>e=&gt;end</span></span>
<span class="line"><span></span></span>
<span class="line"><span>st-&gt;op-&gt;cond</span></span>
<span class="line"><span>cond(yes)-&gt;e</span></span>
<span class="line"><span>cond(no)-&gt;op</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br></div></div><h3 id="多媒体" tabindex="-1">多媒体 <a class="header-anchor" href="#多媒体" aria-label="Permalink to &quot;多媒体&quot;">​</a></h3><p>支持 v.qq.com，youtube.com，youku.com，coub.com，facebook.com/video，dailymotion.com，.mp4，.m4v，.ogg，.ogv，.webm，.mp3，.wav 链接解析</p><p><a href="https://v.qq.com/x/cover/zf2z0xpqcculhcz/y0016tj0qvh.html" target="_blank" rel="noreferrer">https://v.qq.com/x/cover/zf2z0xpqcculhcz/y0016tj0qvh.html</a></p><h3 id="脚注" tabindex="-1">脚注 <a class="header-anchor" href="#脚注" aria-label="Permalink to &quot;脚注&quot;">​</a></h3><p>这里是一个脚注引用<a href="./第一个脚注定义。.html">^1</a>，这里是另一个脚注引用<a href="./脚注定义可使用多段内容。.html">^bignote</a>。</p><pre><code>缩进对齐的段落包含在这个脚注定义内。

```text
可以使用代码块。
```

还有其他行级排版语法，比如**加粗**和[链接](https://b3log.org)。
</code></pre><div class="language-text vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">text</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span>这里是一个脚注引用[^1]，这里是另一个脚注引用[^bignote]。</span></span>
<span class="line"><span>[^1]: 第一个脚注定义。</span></span>
<span class="line"><span>[^bignote]: 脚注定义可使用多段内容。</span></span>
<span class="line"><span></span></span>
<span class="line"><span>    缩进对齐的段落包含在这个脚注定义内。</span></span>
<span class="line"><span></span></span>
<span class="line"><span>    ```</span></span>
<span class="line"><span>    可以使用代码块。</span></span>
<span class="line"><span>    ```</span></span>
<span class="line"><span></span></span>
<span class="line"><span>    还有其他行级排版语法，比如**加粗**和[链接](https://b3log.org)。</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br></div></div><h2 id="快捷键" tabindex="-1">快捷键 <a class="header-anchor" href="#快捷键" aria-label="Permalink to &quot;快捷键&quot;">​</a></h2><p>我们的编辑器支持很多快捷键，具体请参考 <a href="https://ld246.com/article/1582778815353" target="_blank" rel="noreferrer">键盘快捷键</a></p></div></div></main><footer class="VPDocFooter" data-v-5323408c data-v-637b38a6><!--[--><!--]--><div class="edit-info" data-v-637b38a6><!----><div class="last-updated" data-v-637b38a6><p class="VPLastUpdated" data-v-637b38a6 data-v-7b3d4238>Last updated: <time datetime="2023-12-20T01:29:08.000Z" data-v-7b3d4238></time></p></div></div><!----></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
    <script>window.__VP_HASH_MAP__=JSON.parse("{\"guide_info.md\":\"BG-vJLDy\",\"libs_zh_animation_elsanimationqueue.md\":\"DBqcmUZq\",\"libs_index.md\":\"BzAfaRZ6\",\"libs_zh_base_codeeditor.md\":\"DRgqc-1g\",\"libs_zh_base_dialogtable.md\":\"BvVUzI8i\",\"libs_zh_data_elsbutton.md\":\"DLlE0Iq4\",\"libs_zh_lowcode_elscontent.md\":\"BuMrfq6_\",\"index.md\":\"C61moqGG\",\"demos_base_elsmarkdown_test.md\":\"Bzu3x6bV\",\"libs_zh_base_elslistform.md\":\"D50gN5F2\",\"guide_quickstart.md\":\"CthXQ01c\",\"demos_base_elsmarkdown_mdv3.md\":\"B5syA_AQ\",\"libs_zh_base_elsscroll.md\":\"CTV5bb5i\",\"libs_zh_data_elsformdesign.md\":\"BSRREjnc\",\"guide_index.md\":\"DjcOZ4Tk\",\"libs_zh_base_modalok.md\":\"BNXkzpjJ\",\"libs_zh_data_elsicon.md\":\"CpwhQsq1\",\"libs_zh_base_elstable.md\":\"BMATHXuo\",\"libs_zh_base_elsmarkdown.md\":\"BEK8XP36\",\"libs_zh_base_elsform.md\":\"0M-u_KgY\",\"plugins_index.md\":\"Ck2b93WC\",\"libs_zh_base_jsonview.md\":\"DNGAEPF0\",\"libs_zh_group_selfselect.md\":\"BasWwPIY\",\"libs_zh_base_elselem.md\":\"BRXvaVxR\",\"libs_zh_base_elstableold.md\":\"B1Mtn7pj\",\"libs_zh_base_elsx6.md\":\"BNGozCm5\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"zh-cn\",\"dir\":\"ltr\",\"title\":\"UI DEMO\",\"description\":\"组件库和插件库\",\"base\":\"/abs-ui-doc/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"logo\":\"/vue.svg\",\"siteTitle\":\"组件库标题\",\"outline\":3,\"search\":{\"provider\":\"local\"},\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/vuejs/vitepress\"}],\"nav\":[{\"text\":\"指南\",\"link\":\"/guide/\"},{\"text\":\"组件库\",\"link\":\"/libs/\"},{\"text\":\"插件库\",\"link\":\"/plugins/\"}],\"sidebar\":{\"/guide\":[{\"text\":\"指南\",\"items\":[{\"text\":\"快速开始\",\"link\":\"/guide/quickstart\"},{\"text\":\"组件库介绍\",\"link\":\"/guide/\"}]}],\"/libs\":[{\"text\":\"基础分组\",\"collapsed\":true,\"items\":[{\"text\":\"抽象元素\",\"link\":\"/libs/zh/Base/ElsElem.md\"},{\"text\":\"抽象表单\",\"link\":\"/libs/zh/Base/ElsForm.md\"},{\"text\":\"自定义滚动条\",\"link\":\"/libs/zh/Base/ElsScroll.md\"},{\"text\":\"抽象表格\",\"link\":\"/libs/zh/Base/ElsTable.md\"},{\"text\":\"旧版表格组件\",\"link\":\"/libs/zh/Base/ElsTableOld.md\"},{\"text\":\"Markdown 编辑器\",\"link\":\"/libs/zh/Base/ElsMarkdown.md\"},{\"text\":\"代码编辑器\",\"link\":\"/libs/zh/Base/CodeEditor.md\"},{\"text\":\"JSON 数据展示\",\"link\":\"/libs/zh/Base/JsonView.md\"},{\"text\":\"表单集合\",\"link\":\"/libs/zh/Base/ElsListForm.md\"},{\"text\":\"弹框表格\",\"link\":\"/libs/zh/Base/DialogTable.md\"},{\"text\":\"自定义模态框\",\"link\":\"/libs/zh/Base/ModalOk.md\"}]},{\"text\":\"动效分组\",\"collapsed\":true,\"items\":[{\"text\":\"动画队列\",\"link\":\"/libs/zh/Animation/ElsAnimationQueue.md\"},{\"text\":\"幻灯片组件\",\"link\":\"/libs/zh/Animation/ElsPpt.md\"}]},{\"text\":\"数据分组\",\"collapsed\":true,\"items\":[{\"text\":\"图标\",\"link\":\"/libs/zh/Data/ElsIcon.md\"},{\"text\":\"抽象按钮\",\"link\":\"/libs/zh/Data/ElsButton.md\"},{\"text\":\"表单设计器\",\"link\":\"/libs/zh/Data/ElsFormDesign.md\"}]},{\"text\":\"低代码\",\"collapsed\":true,\"items\":[{\"text\":\"静态内容数据化\",\"link\":\"/libs/zh/LowCode/ElsContent.md\"}]}],\"/plugins\":[]}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
    
  </body>
</html>